/**
 * Desc :
 * Created by byte2 on 2016-12-26.
 */
import Lang from '../../libs/i18';
import FileUpload from "react-fileupload";
import {URL} from "../../libs/Url";
export default React.createClass({
    propTypes: {
        onsuccess: React.PropTypes.func
    },
    getDefaultProps(){
        return {
            multiple: false,//默认单文件
        }
    },
    getInitialState(){
        return {
            preview: '',
            selected: [] //已选图片
        }
    },
    readFile(file){

    },
    render(){
        const self = this;
        var options = {
            baseUrl: self.props.url || URL.Get_UPLOAD,
            fileFieldName: 'file',
            param: {
                fid: 0
            },
            multiple: self.props.multiple,//多文件或单文件
            chooseAndUpload: false,
            accept: 'image/*',
            withCredentials: true,
            // beforeChoose: function () {
            //     return user.isAllowUpload
            // },
            chooseFile: function (files) {
                let files_ = Array.from(files);
                self.setState({
                    selected: files_
                });
                //console.log('you choose', typeof files == 'string' ? files : files[0].name)
            },
            beforeUpload: function (files, mill) {
                if (typeof files == 'string') return true;
                if (files[0].size < 1024 * 1024 * 20) {
                    files[0].mill = mill;
                    return true
                }
                return false
            },
            doUpload: function (files, mill) {
                console.log('you just uploaded', typeof files == 'string' ? files : files[0].name)
            },
            uploading: function (progress) {
                console.log('loading...', progress.loaded / progress.total + '%')
            },
            uploadSuccess: function (resp) {
                console.log('upload success..!' + resp.result.data.image);
                self.setState({
                    preview: URL.FUN_UPLOAD_PREVIEW(resp.result.data.image.photoid)
                });
                self.props.onsuccess(resp.result.data.image.photoid)
            },
            uploadError: function (err) {
                alert(err.message)
            },
            uploadFail: function (resp) {
                // console.log(resp);
                alert(resp)
            }
        };
        return (
            <div>
                <div className="upload-list">
                    <ul>
                        {
                            self.state.selected.map((item, index) => {
                                return <li key={index}><i className="fa fa-close"></i>
                                    <div className="pic"><img src={require('../../imgs/image1.jpg')}/></div>
                                    <p>运动会精彩瞬间1</p>
                                </li>;
                            })
                        }
                        {
                            self.state.selected.length ? <li className="add-img"><i>+</i> 继续添加照片</li> : ''
                        }
                    </ul>
                </div>
                <input type="file" />
                <div id="preview">
                </div>
                <FileUpload options={options}>
                    <button
                        className=" btn btn-info btn-lg"
                        ref="chooseBtn">
                        <i className="fa fa-upload"></i> {Lang.UPLOAD.CHOOSE}上传照片
                    </button>
                    <button ref="uploadBtn">upload</button>
                </FileUpload>
            </div>
        )
    }
})

